<template>
	<view>
		<view class="table-title">
			{{form.tableName}}
		</view>
		<view class="uni-container">
			<uni-table ref="table" :loading="loading" border stripe emptyText="暂无更多数据" >
				<uni-tr>
					
					<uni-th align="center">
						<uni-row>
							<uni-col :span="4">序号</uni-col>
							<uni-col :span="10">类型</uni-col>
							<uni-col :span="10">项目</uni-col>
						</uni-row>
					</uni-th>
					
				
				</uni-tr>
					
				<uni-tr v-for="(item, index) in form.ucQuoProjects" :key="index">
					
					<uni-td align="center">
						<uni-row>
							<view style="display: flex;align-items: stretch;">
								<uni-col :span="4">
									<view class="border-solid" style="flex-direction: column;">
										<view>
											{{ item.indexNo }}
										</view>
										<view v-if="item.score && item.score > 0">
											{{ '('+item.score+'分)' }}
										</view>
									</view>
								</uni-col>
								<uni-col :span="20">
									<uni-col :span="24">
										<view style="display: flex;align-items: stretch;!important">
											<uni-col :span="12">
												<view class="border-solid">
													<DictTag option="quota_type" :value="item.quotaType"/>
												</view>
											</uni-col>
											<uni-col :span="12">
												<view class="border-solid">
													{{ item.name }}
												</view>
											</uni-col>
										</view>
										
									</uni-col>
									
									
									<uni-col :span="24">
										<view class="border-solid" style="flex-direction: column;">
											<uni-col :span="24" v-for="(ucQuoProjectItem,indexItem) in item.ucQuoProjectItems" :key="ucQuoProjectItem.id">
												<uni-col :span="24" v-if ="item.chooseType == 1">
													<uni-col :span="16">
														<view style="text-align:left;padding-left: 10rpx;padding-right: 10rpx;"
														v-if="ucQuoProjectItem.content && ucQuoProjectItem.content != ''">
															{{item.content }}
														</view>
														<view style="text-align:left;padding-left: 10rpx;padding-right: 10rpx;"
														v-if="!ucQuoProjectItem.content || ucQuoProjectItem.content == ''">
															{{item.content }}
														</view>
													</uni-col>
													
													<uni-col :span="8">
														<view style="text-align:left;padding-left: 10rpx;padding-right: 10rpx;" 
														v-if="ucQuoProjectItem.scoreText && ucQuoProjectItem.scoreText != 0">
															{{ucQuoProjectItem.scoreText + '分'}} × {{ucQuoProjectItem.num }} = {{ucQuoProjectItem.scoreText * ucQuoProjectItem.num + '分'}}<br/>
														</view>
													</uni-col>
												</uni-col>
												<uni-col :span="24" v-if ="item.chooseType == 2 ||item.chooseType == 3">
													<uni-col :span="16">
														<view style="text-align:left;padding-left: 10rpx;padding-right: 10rpx;" >
															{{ucQuoProjectItem.indexStr + ' ' +ucQuoProjectItem.name + '('+ucQuoProjectItem.score+'分)' }}
														</view>
													</uni-col>
													
													<uni-col :span="8">
														<view style="text-align:left;padding-left: 10rpx;padding-right: 10rpx;" 
														v-if="ucQuoProjectItem.num && ucQuoProjectItem.num > 0">
															{{ucQuoProjectItem.score + '分'}} × {{ucQuoProjectItem.num }} = {{ucQuoProjectItem.score * ucQuoProjectItem.num + '分'}}
														</view>
													</uni-col>
												</uni-col>
											</uni-col>
										</view>
										
									</uni-col>
								</uni-col>
								
							</view>
							
						</uni-row>
					</uni-td>
					
				
					
				</uni-tr>
			</uni-table>

			<view style="height: 30rpx;"></view>
			<uni-row>
				<uni-col :span="3">附件</uni-col>
				<uni-col :span="21">
					<uni-file-picker :imageStyles="{width:'200rpx',height: '200rpx'}" :value="imgInit.imgList"
						file-mediatype="image" :limit="9" file-extname="png,jpg,jpeg" :readonly="true"/>
				</uni-col>
			</uni-row>
			<view style="height: 60rpx;"></view>
			<uni-row>
				<uni-col :span="24" v-if="form.applyStatus==300">
					<uni-forms-item label="审核备注">
						<view>{{form.remark}}</view>
					</uni-forms-item>
				</uni-col>
			</uni-row>
			
		</view>
		
	</view>
</template>

<script>
	import { getDicts } from '@/components/DictTag/DictTag.js'
	import {image_base_url} from '@/api/config.js'
	export default {
		props: {
			applyId:{
				type: Number,
				required: true,
			},
		},
		data() {
			return {
				imageBaseUrl: image_base_url,
				dictTypes:[
					'quota_type'
				],
				dicts:{
					quota_type:[],
				},
				form:{
					id:0,
					applyId:0,
					ucQuoProjects:[],
					imgList:[],
				},
				imgInit:{
					imgList:[],
				},
			}
		},
		watch: {
			// 关键点：监听props变化
			applyId: {
				handler(newVal) {
					if (newVal && immediate > 0) {
						this.searchApplyInfo(newVal)
					}
				}
			}
		},
		created(){
			this.searchApplyInfo(this.applyId)
		},
		methods: {
			getFormatDicts(){
				this.dictTypes.forEach(dictType =>{
					getDicts(dictType).then(res =>{
						this.dicts[dictType] = res
					})
				})
			},
			searchApplyInfo(applyId){
				if (applyId && applyId!=0) {
					this.$http({
						url: `/points/applyInfo/searchApplyInfo/${applyId}`,
						method: 'get',
					}).then(res => {
						if(res && res.data){
							this.form = res.data
							if(res.data.id){
								res.data.imgList.forEach(img => {
									this.imgInit.imgList.push({
										url: this.imageBaseUrl + img,
										name: img,
										extname: ''
									})
								})
							}else{
								this.form.applyId = applyId;
							}
						}else {
							let msg = '错误'
							uni.showToast({
								title: msg,
								icon: 'error',
								duration: 2000
							})
						}
						
					});
				}
				
			},
			
			
		}
	}
</script>

<style lang="scss">
.table-title{
	height: 140rpx;
	line-height: 70rpx;
	text-align: center;
	padding-left: 5%;
	padding-right: 5%;
	font-weight: bolder;
	border: solid 1rpx #e8f4ff;
	background-color: #e8f4ff;
	color: #1890ff;
}
.border-solid{
	height: 100%;
	width: 100%;
	border: solid 1px #ebeef5;
	display: flex;
	justify-content: center;
	align-items: center;
}

</style>
